<div id="notification" class="notification error" style="display: none"></div>
<!-- Horizontal form (default) -->
<form class="horizontal-form" id="frmUser">

  <div style="margin-bottom: 20px;">
<!--    <p>
      <label><?php //echo $form['ref_number']->renderLabel() ?></label>
      <?php //echo $form['ref_number']->render() ?>
    </p>-->
    <?php if($sf_user->hasPermission('classify')): ?>
    <p>
      <label><?php echo $form['status']->renderLabel() ?></label>
      <?php echo $form['status']->render() ?>
    </p>
    <?php endif; ?>
    <?php echo $form->renderHiddenFields() ?>
  </div>

				<div class="form-tabs">

          <!-- Wizard -->
					<!-- Wizard Steps -->
					<ol class="wizard-steps">
              <li><a id="form-part1" class="current" href="javascript:void(0)">Personal Information</a></li>
              <li><a id="form-part2" href="javascript:void(0)">Employment/Financial Information</a></li>
              <li><a id="form-part3" href="javascript:void(0)">Bill and Service Information</a></li>
              <li><a id="form-part4" href="javascript:void(0)">Bulk Service Application</a></li>
					</ol>
					<!-- /Wizard Steps -->


					<div class="form-tab" id="formtab1">

            <!-- Personal Information Fieldset -->
            <fieldset class="form-part1 current">
              <legend>Personal Information</legend>

              <dl class="sections">
                <dt><?php echo $form['existing_subscriber']->renderLabel() ?></dt>
                <dd><?php echo $form['existing_subscriber']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['globe_mobile_access_code']->renderLabel() ?></dt>
                <dd><?php echo $form['globe_mobile_access_code']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['globe_mobile_phone_number']->renderLabel() ?></dt>
                <dd><?php echo $form['globe_mobile_phone_number']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['globe_telephone_access_code']->renderLabel() ?></dt>
                <dd><?php echo $form['globe_telephone_access_code']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['globe_telephone_phone_number']->renderLabel() ?></dt>
                <dd><?php echo $form['globe_telephone_phone_number']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['others_subscriber']->renderLabel() ?></dt>
                <dd><?php echo $form['others_subscriber']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <hr />
<!--              <dl class="sections">
                <dt><?php //echo $form['title']->renderLabel() ?></dt>
                <dd><?php //echo $form['title']->render() ?></dd>
              </dl>-->
              <dl class="sections">
                <dt><?php echo $form['sex']->renderLabel() ?></dt>
                <dd><?php echo $form['sex']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['last_name']->renderLabel() ?></dt>
                <dd><?php echo $form['last_name']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['first_name']->renderLabel() ?></dt>
                <dd><?php echo $form['first_name']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['middle_name']->renderLabel() ?></dt>
                <dd><?php echo $form['middle_name']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['birthday']->renderLabel() ?></dt>
                <dd><?php echo $form['birthday']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['mothers_maiden_name']->renderLabel() ?></dt>
                <dd><?php echo $form['mothers_maiden_name']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <hr />
              <dl class="sections">
                <dt><?php echo $form['home_ownership']->renderLabel() ?></dt>
                <dd><?php echo $form['home_ownership']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['rented_per_month']->renderLabel() ?></dt>
                <dd><?php echo $form['rented_per_month']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['mortgage_per_month']->renderLabel() ?></dt>
                <dd><?php echo $form['mortgage_per_month']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['years_of_stay']->renderLabel() ?></dt>
                <dd><?php echo $form['years_of_stay']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['home_address']->renderLabel() ?></dt>
                <dd><?php echo $form['home_address']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['home_brgy_municipality_town']->renderLabel() ?></dt>
                <dd><?php echo $form['home_brgy_municipality_town']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['home_city_province']->renderLabel() ?></dt>
                <dd><?php echo $form['home_city_province']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['home_postal_code_zip_code']->renderLabel() ?></dt>
                <dd><?php echo $form['home_postal_code_zip_code']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['home_telephone_number']->renderLabel() ?></dt>
                <dd><?php echo $form['home_telephone_number']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['email_address']->renderLabel() ?></dt>
                <dd><?php echo $form['email_address']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['tin']->renderLabel() ?></dt>
                <dd><?php echo $form['tin']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['gsis_sss']->renderLabel() ?></dt>
                <dd><?php echo $form['gsis_sss']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['citizenship']->renderLabel() ?></dt>
                <dd><?php echo $form['citizenship']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['foreigner_country']->renderLabel() ?></dt>
                <dd><?php echo $form['foreigner_country']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['passport_number']->renderLabel() ?></dt>
                <dd><?php echo $form['passport_number']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['acr_number']->renderLabel() ?></dt>
                <dd><?php echo $form['acr_number']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['passport_expiry_date']->renderLabel() ?></dt>
                <dd><?php echo $form['passport_expiry_date']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['civil_status']->renderLabel() ?></dt>
                <dd><?php echo $form['civil_status']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['spouse_name']->renderLabel() ?></dt>
                <dd><?php echo $form['spouse_name']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['spouse_birthday']->renderLabel() ?></dt>
                <dd><?php echo $form['spouse_birthday']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['spouse_profession_company_name']->renderLabel() ?></dt>
                <dd><?php echo $form['spouse_profession_company_name']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['spouse_position']->renderLabel() ?></dt>
                <dd><?php echo $form['spouse_position']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['spouse_telephone_number']->renderLabel() ?></dt>
                <dd><?php echo $form['spouse_telephone_number']->render() ?></dd>
              </dl>
<!--              <dl class="sections">
                <dt><?php //echo $form['msa_number']->renderLabel() ?></dt>
                <dd><?php //echo $form['msa_number']->render() ?></dd>
              </dl>-->
              <div class="clear" style="height:20px"></div>
            </fieldset>
            <!-- /Personal Information Fieldset -->

            <!-- Employment/Financial Information Fieldset -->
            <fieldset class="form-part2" style="display:none">
              <legend>Employment/Financial Information</legend>
              <dl class="sections">
                <dt><?php echo $form['employer_business_name']->renderLabel() ?></dt>
                <dd><?php echo $form['employer_business_name']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['industry']->renderLabel() ?></dt>
                <dd><?php echo $form['industry']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['business_address']->renderLabel() ?></dt>
                <dd><?php echo $form['business_address']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['business_brgy_municipality_town']->renderLabel() ?></dt>
                <dd><?php echo $form['business_brgy_municipality_town']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['business_city_province']->renderLabel() ?></dt>
                <dd><?php echo $form['business_city_province']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['business_postal_code_zip_code']->renderLabel() ?></dt>
                <dd><?php echo $form['business_postal_code_zip_code']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['office_telephone_number']->renderLabel() ?></dt>
                <dd><?php echo $form['office_telephone_number']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['years_in_company']->renderLabel() ?></dt>
                <dd><?php echo $form['years_in_company']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['current_position_held']->renderLabel() ?></dt>
                <dd><?php echo $form['current_position_held']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['personal_monthly_income']->renderLabel() ?></dt>
                <dd><?php echo $form['personal_monthly_income']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['authorized_contact_person']->renderLabel() ?></dt>
                <dd><?php echo $form['authorized_contact_person']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['authorized_contact_relation']->renderLabel() ?></dt>
                <dd><?php echo $form['authorized_contact_relation']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['authorized_contact_number']->renderLabel() ?></dt>
                <dd><?php echo $form['authorized_contact_number']->render() ?></dd>
              </dl>
              <div class="clear" style="height:20px"></div>
            </fieldset>
            <!-- /Employment/Financial Information Fieldset -->

            <!-- Bill and Service Information Fieldset -->
            <fieldset class="form-part3" style="display:none">
              <legend>Bill and Service Information</legend>
              <dl class="sections">
                <dt><?php echo $form['bills_sent_to']->renderLabel() ?></dt>
                <dd><?php echo $form['bills_sent_to']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <hr />
              <dl class="sections">
                <dt><?php echo $form['plans_gplan']->renderLabel() ?></dt>
                <dd><?php echo $form['plans_gplan']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['plans_gflex']->renderLabel() ?></dt>
                <dd><?php echo $form['plans_gflex']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['plans_others']->renderLabel() ?></dt>
                <dd><?php echo $form['plans_others']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['promo']->renderLabel() ?></dt>
                <dd><?php echo $form['promo']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['value_added_service_special_features']->renderLabel() ?></dt>
                <dd><?php echo $form['value_added_service_special_features']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['handset_brand_model']->renderLabel() ?></dt>
                <dd><?php echo $form['handset_brand_model']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['handset_provided_by']->renderLabel() ?></dt>
                <dd><?php echo $form['handset_provided_by']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['handset_imei_number']->renderLabel() ?></dt>
                <dd><?php echo $form['handset_imei_number']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['handset_hbp']->renderLabel() ?></dt>
                <dd><?php echo $form['handset_hbp']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['handset_lockup_period']->renderLabel() ?></dt>
                <dd><?php echo $form['handset_lockup_period']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['sim_card_number']->renderLabel() ?></dt>
                <dd><?php echo $form['sim_card_number']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <hr />
              <dl class="sections">
                <dt><?php echo $form['authorized_person_to_receive_delivery']->renderLabel() ?></dt>
                <dd><?php echo $form['authorized_person_to_receive_delivery']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['complete_delivery_address']->renderLabel() ?></dt>
                <dd><?php echo $form['complete_delivery_address']->render() ?></dd>
              </dl>
              <div class="clear" style="height:20px"></div>
            </fieldset>
            <!-- /Bill and Service Information Fieldset -->

            <!-- Bulk Service Application Fieldset -->
            <fieldset class="form-part4" style="display:none">
              <legend>Bulk Service Application (optional)</legend>
              <dl class="sections">
                <dt><?php echo $form['bulk_service']->renderLabel() ?></dt>
                <dd><?php echo $form['bulk_service']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['max_authorized_recipients']->renderLabel() ?></dt>
                <dd><?php echo $form['max_authorized_recipients']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['distribution_type']->renderLabel() ?></dt>
                <dd><?php echo $form['distribution_type']->render() ?></dd>
              </dl>
              <div class="clear"></div>
              <dl class="sections">
                <dt><?php echo $form['nominated_postpaid_charging_account']->renderLabel() ?></dt>
                <dd><?php echo $form['nominated_postpaid_charging_account']->render() ?></dd>
              </dl>
              <dl class="sections">
                <dt><?php echo $form['corporate_id']->renderLabel() ?></dt>
                <dd><?php echo $form['corporate_id']->render() ?></dd>
              </dl>
              <div class="clear" style="height:20px"></div>
            </fieldset>
            <!-- /Bulk Service Application Fieldset -->

					</div>
					<!-- /Side Tab Content #sidetab1 -->

				</div>

    <input id="submitUser" style="float: right; display:none;" type="button" class="blue small" value="Submit" />
    <input id="nextStep" style="float: right;" type="button" class="blue small" value="Next - Employment/Financial Information" />
    <input id="cancelUser" type="button" class="blue small" value="Back" />

    <div class="clear"></div>

</form>

<script type="text/javascript">
$(document).ready(function() {

    // initialize step
    var step = 1;


    // function to hide/show dependent fields
    showHideFields = function(elements) {
      if(elements === undefined) {
        elements = $('.dependent');
      }
      $.each(elements, function() {
        switch($(this).attr('data-dependent')) {

          // check for dependent fields of existing subscriber
          case 'application_corporate_individual_existing_subscriber':
            if(!$('#'+$(this).attr('data-dependent')).is(':checked')) {
              $(this).val('');
              $(this).parents('dl').slideUp('normal',function() {
                $('label[for="'+$(this).attr('id')+'"]').parents('dl').slideUp();
              });
            }
            else {
              $(this).parents('dl').slideDown('normal',function() {
                $('label[for="'+$(this).attr('id')+'"]').parents('dl').slideDown();
              });
            }
            break;
          // check for dependent fields of civil status
          case 'application_corporate_individual_civil_status':
            if($('#'+$(this).attr('data-dependent')).val() != 'MARRIED') {
              $(this).val('');
              $(this).parents('dl').slideUp('normal',function() {
                $('label[for="'+$(this).attr('id')+'"]').parents('dl').slideUp();
              });
            }
            else {
              $(this).parents('dl').slideDown('normal',function() {
                $('label[for="'+$(this).attr('id')+'"]').parents('dl').slideDown();
              });
            }
            break;
        }





      });

    }

    showHideFields();


    // attach showHideFields to change events
    $('#application_corporate_individual_existing_subscriber').change(function() {
      showHideFields();
    });
    $('#application_corporate_individual_civil_status').change(function() {
      showHideFields();
    });


    $("#frmUser").validationEngine();

    $('.form-tabs li a').click(function() {
      var parentIndex = $(this).parent().index();
      var proceed = false;
      if((parseInt(parentIndex)+1) > step) {
        if(jQuery("#frmUser").validationEngine('validate')) {
          proceed = true;
        }
      }
      else {
        proceed = true;
      }

      if(proceed) {
        $('div.formError').remove();
        var thisID = $(this).attr('id');
        if(thisID != $('nav#form-tab ul li a.current').attr('id')) {

          $('.form-tabs ol li a.current').removeClass('current');
          $('#frmUser fieldset.current').fadeOut('slow',function() {
            $(this).removeClass('current');
            $('fieldset.'+thisID).fadeIn('slow',function() {
              $('.form-tabs ol li a#'+thisID+', fieldset.'+thisID).addClass('current');
              step = parseInt(parentIndex)+1;

              if(thisID == 'form-part4') {
                $('#nextStep').hide();
                $('#submitUser').show();
              }
              else {
                var nextStepTitle = $('.form-tabs li a:eq('+step+')').html();
                $('#nextStep').val('Next - '+nextStepTitle);
                $('#nextStep').show();
                $('#submitUser').hide();
              }
              showHideFields();
            });
          });
        }

      }

    });

    $("#submitUser").click(function(){

      if(jQuery("#frmUser").validationEngine('validate')) {
        toggleLoading();
        dataAr = $("#frmUser").serializeArray();
        $.ajax({
            url: '<?php echo ($form->getObject()->isNew()) ? url_for('corporateindividual/ajaxSave') : url_for('corporateindividual/update') ?>',
            type: 'POST',
            dataType: 'json',
            data: dataAr,
            success: function(response){
              $("#notification").empty();
              if(response.valid == 'false') {
                $("#notification").show();
                var errors = response.message.split('|');
                $.each(errors, function(index, value) {
                  $('#notification').append('<p>'+ this + '</p>');
                });
                var colonPos = errors[0].indexOf(':');
                var firstErrorField = errors[0].substring(0,colonPos);

                $.each($('ol.wizard-steps li a'), function(index, value) {
                  if($('.'+$(this).attr('id')+' #application_corporate_individual_'+firstErrorField).length > 0) {
                    $(this).click();
                  }
                });
              }
              else {
                $("#notification").html(response.message);
                $("#tab2-content").empty();
                $("#crud_data").click();
                jQuery("#frmUser").validationEngine('validate');
              }

              toggleLoading();
            }

        });
      }
      else {
        return false;
      }
    });

    $("#cancelUser").click(function(){
      if(step != 1) {
        $('.form-tabs li a:eq('+(parseInt(step)-2)+')').click();
      }
      else {
        $("#tab2-content").empty();
        $('div.formError').remove();
        $("#crud_data").click();
      }
    });

    $('#nextStep').click(function() {
      $('.form-tabs li a:eq('+(parseInt(step))+')').click();
    });

});
</script>